<!doctype html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link href="../css/mui.min.css" rel="stylesheet" />
		<link href="../css/xzx_pull_refresh.css" rel="stylesheet" />
		<link rel="stylesheet" href="../style/fjol_style.css" />
	</head>

	<body>
		<script src="../js/mui.min.js"></script>
		<script src="../js/common.util.js"></script>
		<script src="../js/network.js"></script>
		<script src='../js/md5.js'></script>
		<script src="../js/mui.pullToRefresh.js"></script>
		<script src="../js/mui.pullToRefresh.material.js"></script>
		<div id="refreshContainer" class="mui-content mui-scroll-wrapper">
			<div class="mui-scroll">
				<!--数据列表-->
				<ul class="mui-table-view">

				</ul>
			</div>
		</div>
		
		<script type="text/javascript">
			var _type = 2; //1新房，2二手房，3租房
			var _pageNo = 1;
			var _lstData;
			
			mui.init({
				pullRefresh: {
					container: "#refreshContainer", //下拉刷新容器标识，querySelector能定位的css选择器均可，比如：id、.class等
					down: {
						height: 50, //可选,默认50.触发下拉刷新拖动距离,
						auto: false, //可选,默认false.首次加载自动下拉刷新一次
						contentdown: "下拉可以刷新", //可选，在下拉可刷新状态时，下拉刷新控件上显示的标题内容
						contentover: "释放立即刷新", //可选，在释放可刷新状态时，下拉刷新控件上显示的标题内容
						contentrefresh: "正在刷新...", //可选，正在刷新状态时，下拉刷新控件上显示的标题内容
						callback: pulldownRefresh //必选，刷新函数，根据具体业务来编写，比如通过ajax从服务器获取新数据；
					},
					up: {
						height: 50, //可选.默认50.触发上拉加载拖动距离
						auto: false, //可选,默认false.自动上拉加载一次 
						contentrefresh: "正在加载...", //可选，正在加载状态时，上拉加载控件上显示的标题内容
						contentnomore: '没有更多数据了', //可选，请求完毕若没有更多数据时显示的提醒内容；
						callback: pullUpLoadMore
					}
				}
			});
			
			mui.plusReady(function() {
				var centerView= plus.webview.currentWebview();
				var parentPage = centerView.parent();
				mui.fire(parentPage,'onClientSubPageReady');
//				openDetailPage(_type);
			});
			
			document.addEventListener('configClientSubpage',function(event){
				_type = event.detail.type;
				mui('#refreshContainer').pullRefresh().pulldownLoading();
//				console.log(_type);
			});
			
			//下拉刷新
			function pulldownRefresh() {
				mui('#refreshContainer').pullRefresh().enablePullupToRefresh();
				var ul = document.querySelector('.mui-table-view');
				_pageNo = 1;
				if(_type ==1){
					getMyNewHouseData(_pageNo, function(lstClient) {
						ul.innerHTML = '';
						if(lstClient.length > 0) {
							ul.insertBefore(createNewhouseFragment(ul, lstClient, false), ul.firstChild);
						}else if(lstClient.length == 0) {
							var _li = document.createElement('li');
							_li.className = 'mui-text-center';
							_li.innerHTML = '<img src="../images/icon_blank.png"/>';
							ul.insertBefore(_li,null);
//							console.log(ul.innerHTML);
						}
						mui('#refreshContainer').pullRefresh().endPulldownToRefresh();
					}, function() {
						mui('#refreshContainer').pullRefresh().endPulldownToRefresh();
					});
				}else{
					getMyHouseData(_pageNo, _type, function(lstClient) {
						ul.innerHTML = '';
						if(lstClient.length > 0) {
							ul.insertBefore(createFragment(ul, lstClient, false), ul.firstChild);
						}else if(lstClient.length == 0) {
							var _li = document.createElement('li');
							_li.className = 'mui-text-center';
							_li.innerHTML = '<img src="../images/icon_blank.png"/>';
							ul.insertBefore(_li,null);
//							console.log(ul.innerHTML);
						}
						mui('#refreshContainer').pullRefresh().endPulldownToRefresh();
					}, function() {
						mui('#refreshContainer').pullRefresh().endPulldownToRefresh();
					});
				}
//				openDetailPage(_type);
			}
			
			//上拉加载
			function pullUpLoadMore() {
				var ul = document.querySelector('.mui-table-view');
				_pageNo++;
				if(_type == 1){
					getMyNewHouseData(_pageNo,function(lstClient) {
						if(lstClient.length > 0) {
							ul.appendChild(createNewhouseFragment(ul, lstClient, true));
						}
						mui('#refreshContainer').pullRefresh().endPullupToRefresh(lstClient.length);
					}, function() {
						mui('#refreshContainer').pullRefresh().endPullupToRefresh();
					});
				}else{
					getMyHouseData(_pageNo, _type, function(lstClient) {
						if(lstClient.length > 0) {
							ul.appendChild(createFragment(ul, lstClient, true));
						}
						mui('#refreshContainer').pullRefresh().endPullupToRefresh(lstClient.length);
					}, function() {
						mui('#refreshContainer').pullRefresh().endPullupToRefresh();
					});
				}
					
//				openDetailPage(_type);
			}

			var getMyHouseData = function(page, kind, successCallback, failCallback) {
				var userInfo = common.myStorage.getItem('userInfo');
				var param = [{
					key: 'clientId',
					value: userInfo.clientId
				}, {
					key: 'kind',
					value: kind
				}, {
					key: 'page',
					value: page
				}, {
					key: 'rows',
					value: 10
				}];
				var net = fjNetwork;
				net.get('fjzx/client/saleman-list.json', param, function(data) {
					//成功
					successCallback(data.rows);
//					console.log(JSON.stringify(data));

				}, function(message) {
					//失败
					mui.toast(message);
					failCallback();
				});
			};
			var getMyNewHouseData = function(page, successCallback, failCallback) {
				var userInfo = common.myStorage.getItem('userInfo');
				var param = [{
					key: 'clientId',
					value: userInfo.clientId
				}, {
					key: 'page',
					value: page
				}, {
					key: 'rows',
					value: 10
				}];
				var net = fjNetwork;
				net.get('fjzx/client/saleman-building-list.json', param, function(data) {
					//成功
					successCallback(data.rows);
//					console.log(JSON.stringify(data));

				}, function(message) {
					//失败
					mui.toast(message);
					failCallback();
				});
			};
			var createFragment = function(ul, lstHouse) {
				var fragment = document.createDocumentFragment();
				var li;
				for(var i = 0; i < lstHouse.length; i++) {
					li = document.createElement('li');
					li.className = 'mui-table-view-cell';
					var houseInfo = lstHouse[i];
					var data = new Array();
					
					var reserveDate = new Date(houseInfo.reserveDate).toLocaleString();
					
					data.push('<div class="mb10">');
		                		data.push('<img src="../images/user-img.png" height="45" class="vm" style="width:45px;" />');
		                		data.push(houseInfo.realname);
		                		var commentScore = houseInfo.commentScore;
		                		var commentTotal = houseInfo.commentTotal;
		                		var score = parseInt(commentScore/commentTotal);
		                		var scoreRest = commentScore%commentTotal;
		                		var rest = parseInt(5-score);
		                		for (var k=0; k<score; k++) {
		                			data.push('<span class="mui-icon mui-icon-star-filled f10 color02b260"></span>');
		                		}
		                		if(scoreRest !=0){
		                			data.push('<span class="mui-icon mui-icon-starhalf f10 color02b260"></span>');
		                		}
		                		for (var j =0; j<rest; j++) {
		                			data.push('<span class="mui-icon mui-icon-star f10 color02b260"></span>');
		                		}
		                		
		                	data.push('</div>');
		                    data.push('<a href="javascript:;" class="agentHouse pt10 mui-block" style="background:#f0f0f0;" id="'+houseInfo.houseId+'">');
		                        data.push('<img class="mui-pull-left mr5" style="width:100px; heigth:80px;" src="'+houseInfo.coverImage+'">');
		                        data.push('<div class="mui-media-body">');
		                            data.push(houseInfo.title);
		                            data.push('<div class="mui-ellipsis mui-clearfix mt10">');
		                            	data.push('<span class="newRed f14 mui-pull-right">'+parseInt(houseInfo.totalPrice/10000)+'万</span>');
		                            	data.push('<div>');
		                            		data.push('<p>');
		                            			data.push('<span class="mr10">'+houseInfo.area+'</span>');
		                            			data.push('<span>'+houseInfo.buildingName+'</span>');
		                            		data.push('</p>');
		                            		data.push('<p>'+houseInfo.bedRoomNumber+'室'+houseInfo.livingRoomNumber+'厅 '+houseInfo.square+'平方</p>');
		                            	data.push('</div>');
		                            data.push('</div>');
		                        data.push('</div>');
		                    data.push('</a>');
	                            data.push('<div align="right" class="mt10">');
//	                            	data.push('<p class="change-agent mt5 mr5">申请更换经纪人</p>');
	                            	data.push('<span" class=" xa-client-cell-connect" data-tel="'+houseInfo.mobile+'">');
	                            		data.push('<img src="../images/tophone.png" style="width:120px;" class="vm" />');
	                            	data.push('</span>');
	                            data.push('</div>');
					li.innerHTML = data.join('');
					fragment.appendChild(li);
				}
				return fragment;
			};
			
			var createNewhouseFragment = function(ul, lstHouse) {
				var fragment = document.createDocumentFragment();
				var li;
				for(var i = 0; i < lstHouse.length; i++) {
					li = document.createElement('li');
					li.className = 'mui-table-view-cell2';
					var houseInfo = lstHouse[i];
					var data = new Array();
					
					var reserveDate = new Date(houseInfo.reserveDate).toLocaleString();
					
					data.push('<div class="mb10 pt10">');
		                		data.push('<img src="../images/user-img.png" height="45" class="vm" style="width:45px;" />');
		                		data.push(houseInfo.realname);
		                		var commentScore = houseInfo.commentScore;
		                		var commentTotal = houseInfo.commentTotal;
		                		var score = parseInt(commentScore/commentTotal);
		                		var scoreRest = commentScore%commentTotal;
		                		var rest = parseInt(5-score);
		                		for (var k=0; k<score; k++) {
		                			data.push('<span class="mui-icon mui-icon-star-filled f10 color02b260"></span>');
		                		}
		                		if(scoreRest !=0){
		                			data.push('<span class="mui-icon mui-icon-starhalf f10 color02b260"></span>');
		                		}
		                		for (var j =0; j<rest; j++) {
		                			data.push('<span class="mui-icon mui-icon-star f10 color02b260"></span>');
		                		}
		                	data.push('</div>');
		                    data.push('<a href="javascript:;" class="agentHouse pt10 pb10 mui-block mui-clearfix" style="background:#f0f0f0;" id="'+houseInfo.buildingId+'">');
		                        data.push('<img class="mui-pull-left mr5" style="width:100px; heigth:75px;" src="'+houseInfo.coverImage+'">');
		                        data.push('<div class="mui-media-body">');
		                            data.push(houseInfo.buildingName);
		                            data.push('<div class="mui-ellipsis mui-clearfix mt10">');
		                            	data.push('<span class="newRed f12 mui-pull-right">均价&nbsp;'+(houseInfo.averagePrice?houseInfo.averagePrice:0)+'元/㎡</span>');
		                            	data.push('<div>');
		                            		data.push('<p>');
		                            			data.push('<span>'+(houseInfo.bedRoomNumber?houseInfo.bedRoomNumber:0)+'室</span>');
		                            			data.push('<span class="mr5">'+(houseInfo.livingRoomNumber?houseInfo.livingRoomNumber:0)+'厅</span>');
		                            			data.push('<span>建筑面积：'+(houseInfo.square?houseInfo.square:0)+'平方</span>');
		                            		data.push('</p>');
		                            	data.push('</div>');
		                            data.push('</div>');
		                        data.push('</div>');
		                    data.push('</a>');
	                            data.push('<div align="right" class="mt10">');
//	                            	data.push('<p class="change-agent mt5 mr5">申请更换经纪人</p>');
	                            	data.push('<span" class=" xa-client-cell-connect" data-tel="'+houseInfo.mobile+'">');
	                            		data.push('<img src="../images/tophone.png" style="width:120px;" class="vm" />');
	                            	data.push('</span>');
	                            data.push('</div>');
					li.innerHTML = data.join('');
					fragment.appendChild(li);
				}
				return fragment;
			};
			
			//拨打电话处理按钮
			mui(".mui-table-view").on('tap', '.xa-client-cell-connect', function() {
				//获取id
				var li = this.parentNode.parentNode;
				var index = li.id;
//				var infoModel = _lstData[index];
				var btnArray = ['拨打', '取消'];
				var mobile = this.getAttribute('data-tel');
				mui.confirm('是否拨打' + mobile + '?', '提示', btnArray, function(e) {
					if(e.index == 0) {
						plus.device.dial(mobile, false);
					}
				});
			});
			
			//列表点击  进入详情
			var openDetailPage = function(type){
				if(type == 1){
					mui('.mui-table-view').on('tap','.mui-table-view-cell2 .agentHouse',function(){
//						console.log(this.getAttribute('id'));
						mui.openWindow({
								url:'../new_house/newHouse_detail.html',
								id:'newHouse_detail',
								extras:{
									buildingId:this.getAttribute('id'),
									parentid:'new_house'
								}
							});
					});
				}else{
					//跳转房屋详情
			mui('.mui-table-view').on('tap','.mui-table-view-cell .agentHouse',function(){
//				console.log(this.getAttribute('id'));
				mui.openWindow({
					url:'../house_detail.html',
					id:'house_detail',
					extras:{
						houseId:this.getAttribute('id')
					}
				})
			});
				}
			}
			
		</script>
	</body>

</html>